<template>
  <el-dialog
    v-if="visible"
    v-dialogDrag
    modal
    :visible.sync="visible"
    :close-on-click-modal="false"
    width="70%"
  >
    <div slot="title" class="dialog-header">物资退库详情</div>
    <div class="table-name-content">物资退库申请单</div>
    <wz-table :columns="mcDetails" :use-index="true" :table-data="fileData">
      <template #outputType="{ row }">
        <div>
          {{ outputType(row.outputType) }}
        </div>
      </template>
    </wz-table>
  </el-dialog>
</template>

<script>
const MATERIAL_INFO_BACK_COLUMNS = [
    {
        label: '退库申请单号',
        prop: 'retreatDetailId',
        elProps: {
            width: '140px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '物料编码',
        prop: 'categoryCode',
        elProps: {
            width: '140px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '物料名称',
        prop: 'categoryName',
        elProps: {
            width: '160px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库数量',
        prop: 'retreatAmount',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '计量单位',
        prop: 'unit',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库状态',
        prop: 'retreatStateName',
        elProps: {
            width: '120px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '推送仓储状态',
        prop: 'pushName',
        elProps: {
            width: '120px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库类型',
        prop: 'refundType',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库类别',
        prop: 'pmsRetreatType',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库发起人',
        prop: 'spuMainName',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库申请时间',
        prop: 'createTime',
        elProps: {
            width: '120px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '退库完成时间',
        prop: 'retreatTime',
        elProps: {
            width: '120px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '仓储返回信息',
        prop: 'osRealAmount',
        elProps: {
            width: '120px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '不含税单价',
        prop: 'price',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '含税总金额',
        prop: 'totalTaxAmount',
        elProps: {
            width: '100px',
            'show-overflow-tooltip': true
        }
    },
    {
        label: '失败重推',
        prop: 'reTryOperate',
        elProps: {
            'min-width': '100px',
            'show-overflow-tooltip': true
        }
    }
]
import wzTable from '../components/cTable.vue'
import { queryRetreatEquipListSynt } from '@/api/material.js'
export default {
    name: 'ReturnDetailDialog',
    components: { wzTable },
    props: {
        materialRemovalVisible: {
            type: Boolean,
            default: false
        },
        currentRow: {
            type: Object,
            default: () => ({})
        }
    },
    data() {
        return {
            mcDetails: [],
            resourceCoding: [],
            fileData: [],
            assetsFileData: [],
            visible: false
        }
    },
    computed: {
        query() {
            return this.$route.query
        }
    },
    watch: {
        materialRemovalVisible: {
            handler(value) {
                this.visible = value
            },
            immediate: true
        },
        visible(value) {
            this.$emit('update:materialRemovalVisible', value)
        }
    },
    async mounted() {
        this.mcDetails = JSON.parse(JSON.stringify(MATERIAL_INFO_BACK_COLUMNS))
        const res = await queryRetreatEquipListSynt({
            categoryCode: this.currentRow.categoryCode,
            subPrjId: this.query.prjId
        })
        if (+res.code === 200) {
            this.fileData = res.data
            this.assetsFileData = this.fileData[0].assets
        }
    },
    methods: {
        outputType(outputType) {
            return +outputType === 9 ? '是' : '否'
        }
    }
}
</script>
<style lang="scss" scoped>

.mt-10 {
    margin-top: 10px;
}
</style>
